<html>
<head>
<script type="text/javascript"
	src="http://ajax.googleapis.com/ajax/libs/jquery/1.6.2/jquery.min.js"></script>
<script type="text/javascript">src="http://www.ajax-cross-domain.com/cgi-bin/ACD/ACD.js"</script>	
<script type="text/javascript" src="gkajax.js"></script>

<script type="text/javascript">
	function toggle() {
		$("p").toggle();
	}

	function clickevent() {
		alert("toggling caused by" + this.id + event.name);
	}

	// event handlers are all passed 'event' by default
	function noNumbers(e) {
		var keynum;
		var keychar;
		var numcheck;

		keynum = e.which;

		keychar = String.fromCharCode(keynum);
		numcheck = /\d/;
		return !numcheck.test(keychar);
	}	
	
	var xmlhttp; // global for referncing in callback functionis
	function loadXMLDoc(url, cfunc) {
		xmlhttp = new XMLHttpRequest();

		xmlhttp.onreadystatechange = cfunc;
		//xmlhttp.open("GET", url, true);
		xmlhttp.open("GET",url, false);
		xmlhttp.send();
		cfunc();
	}

	function getStock() {
		var sname = $("#shortName");
		var sv = 23.3;

		loadXMLDoc("http://www.ajax-cross-domain.com/cgi-bin/ACD/ACD.js?uri=(http://finance.google.com/finance/info?client=ig&q=NASDAQ%3aGOOG)", function() {
			if (xmlhttp.readyState == 4 && xmlhttp.status == 200) {
				$("#stockValue").attr("value", xmlhttp.responseText);
			}
		});		
	}

	function init() {
		// function NAMES for callbacks 
		$("#toggleButton").click(toggle);
		$("#dummyEvent").click(clickevent);

		// event handlers are all passed 'event' by default
		$("#numOnly").keypress(noNumbers);
		$("#shortName").change(getStock);

		// inline anonymous callbacks
		$("#pink").click(function() {
			$(".colormaychange").css("color", "pink");
		});
		$("#black").click(function() {
			$(".colormaychange").css("color", "black");
		});
	}
	$(document).ready(function() {
		init();
	});
</script>
</head>
<body>
	<!-- using a hidden element as a variable for jquery ajax experiments (I asssume this is not a good use of jquery but lets see)  -->
	<p id="tickerData" hidden="true">empty</p>
	
	<button id="toggleButton">Toggle</button>
	<button id="pink">Pink</button>
	<button id="black">Black</button>
	<button id="dummyEvent">Event</button>
	<a href="mainpage.htm">Home</a>
	<br />
	<br />
	<br />
	<br /> Input (Numbers Only)
	<input type="text" id="numOnly" />
	<br />
	<br />
	<br />
	<p>This is a paragraph with little content.</p>
	<p class="colormaychange">This is another small paragraph.</p>
	<form id="stockForm">
		Stock Short Name : <input id="shortName" type="text" value="MSFT" />
		Current Value : <input id="stockValue" type="text" value="0.0" />
	</form>
	<button type="button" onclick="getStock()">Refresh</button>
</body>
</html>